<template>
  <div class="auto">
    <validator name='v'>
      <form novalidate class="form-horizontal">
        <p class="bg-info text-center" style="padding: 8px;">启用信息</p>
        <!-- <div class="row" style="margin-top:10px;">
          <div  :class="[$v.f_reason.required ? 'has-error' : 'has-success']">
            <label for="f_reason" class=" col-sm-2 control-label">启用说明:</label>
            <div class="col-sm-8">
              <textarea class="form-control" v-model="model.f_reason"
              v-validate:f_reason='{required: true }' rows="3" placeholder="启用说明"></textarea>
            </div>
          </div>
        </div> -->
        <div class="row" style="margin-top:10px;">
          <div class="form-group" :class="[$v.f_reason.required ? 'has-error' : 'has-success']">
            <label for="f_reason" class=" col-sm-2 control-label">启用原因:</label>
            <div class="col-sm-2 " :class="[!$refs.reason.selectedItems || $refs.reason.selectedItems === '' ? 'select-error' : '']">
              <input type="text" v-show="false" v-model="$refs.reason.selectedItems" v-validate="['required']" :field="'reason' + $index">
              <v-select id="f_reason"
              v-model="model.f_reason"
              placeholder='启用原因'
              :value.sync="model.f_reason"
              :options='reason'
              v-ref:reason
              close-on-select ></v-select>
            </div>
          </div>
        </div>
        <div class="row" style="margin-top:1px;" v-if= "model.f_reason[0] === '其他'">
          <div class="col-sm-8 col-sm-offset-2">
            <textarea class="form-control" v-model="model.f_othereason"  rows="3" placeholder="请填写原因"></textarea>
          </div>
        </div>
      </form>
      <div style="text-align:right;height:auto;margin-top:40px;">
        <button class="btn btn-success" @click="confirm()"  :disabled='!$v.valid'>确&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;认</button>
        <button class="btn btn-default" @click="clean()" style="width:80px;margin-left:20px;">取&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;消</button>
      </div>
    </validator>
  </div>
</template>
<script>
/**
*综合业务
*表具启用组件
*/
import AppData from '../../../../../stores/AppData'
export default {
  title: '启用管理',
  props: ['row'],
  data () {
    return {
      model: {
      },
      select: {
        f_date: '',
        f_reason: ''
      }
    }
  },
  methods: {
    confirm () {
      this.$LogicService.meterEnable(this.model, this.row)
      .then(
        (res) => this.$dispatch('success', '表具启用', this.row, res)
      ).catch(
        (error) => {
          if (error.state === 603) {
            this.$error('重复提交')
            return
          }
          this.$dispatch('error', '表具启用', this.row, error)
        }
      )
    },
    clean () {
      this.$info('取消操作')
      this.$dispatch('clean', '表具启用', this.row)
    }
  },
  computed: {
    reason () {
      return AppData.getParam('启用原因')
    }
  }
  // ready () {
  //   this.$SqlService.getRecord('停用', this.row.f_userinfo_id).then((select) => {
  //     this.select.f_date = select.data[0].f_operate_date
  //     this.select.f_reason = select.data[0].f_reason
  //   })
  // }
}
</script>

<style>
</style>
